import {
  audioContext,
  playerStore
} from '../../store/player-store'

const PlayModeNames = ['order', 'repeat', 'random'];
Page({
  data: {

    // 当前歌曲信息
    currentSong: {},

    // 页面切换
    currentPage: 0,

    // 内容区高度
    contentHeight: 0,

    // 当前进度
    currentProcess: 0,

    // 是否正在拖动
    isChanging: false,

    // 歌词滚动高度
    scrollTop: 0,

    // 当前播放时间
    currentTime: 0,

    // 是否是播放状态
    isPlaying: true,

    // 歌曲总时间
    totalTime: 0,

    // 当前播放的歌词索引
    currentLyricIndex: 0,

    // 当前播放的歌词
    currentLyricText: "",

    // 播放模式名称
    playModeName: 'order'
  },
  onLoad: function () {
    this.getCurrentHeight();
    this.listerPlayerStoreData();
  },

  // 获取当前展示页高度
  getCurrentHeight() {
    const globalData = getApp().globalData
    const screenHeight = globalData.screenHeight
    const statusBarHeight = globalData.statusBarHeight
    const navBarHeight = globalData.navBarHeight
    const contentHeight = screenHeight - statusBarHeight - navBarHeight
    this.setData({
      contentHeight
    })
  },

  // 监听store的数据
  listerPlayerStoreData() {

    // 当前的音乐数据（封面图、作者、歌曲名称）
    playerStore.onState('currentSong', (currentSong) => {
      this.setData({
        currentSong
      });
    });

    // 当前播放的时间（毫秒），监听当前播放时间变化，改变进度条进度
    playerStore.onState('currentTime', currentTime => {
      this.setData({
        currentTime,
      });
      if (!this.data.isChanging) {
        this.setData({
          currentProcess: currentTime / this.data.totalTime * 100
        })
      }
    });
    // 歌曲总共的时间（毫秒）
    playerStore.onState('totalTime', totalTime => {
      this.setData({
        totalTime
      });
    });
    // 歌词的信息（歌词文本，当前歌词所在时间）
    playerStore.onState('lyricInfo', lyricInfo => {
      this.setData({
        lyricInfo
      });
    })
    // 当前播放到的歌词文本
    playerStore.onState('currentLyricText', currentLyricText => {
      this.setData({
        currentLyricText
      })
    });
    // 当前播放到的歌词索引
    playerStore.onState('currentLyricIndex', currentLyricIndex => {
      this.setData({
        currentLyricIndex,
        scrollTop: currentLyricIndex * 35
      })
    });
    // 歌曲是否正在播放
    playerStore.onState('isPlaying', isPlaying => {
      this.setData({
        isPlaying
      })
    });
    // 播放模式 单曲循环、顺序播放、随机播放
    playerStore.onState('playModeIndex', playModeIndex => {
      this.setData({
        playModeIndex,
        playModeName: PlayModeNames[playModeIndex]
      })
    })
  },

  // ======================= 事件监听 =======================

  // 切换页面（歌曲 | 歌词）
  handleSwiperChange(event) {
    const current = event.detail.current
    this.setData({
      currentPage: current
    })
  },

  // 进度条改变（点击、拖动松开）
  handleSliderChange(event) {
    const value = event.detail.value;
    const totalTime = this.data.totalTime / 1000;

    // 当前应该的进度比例
    const ratio = value / 100;
    audioContext.pause();

    // 更新歌曲播放的位置
    audioContext.seek(totalTime * ratio);

    // 更新进度条位置
    this.setData({
      currentProcess: value,
      isChanging: false
    })
  },

  // 拖动过程中停止时间改变进度条
  handleSliderChanging() {
    this.setData({
      isChanging: true
    })
  },

  // 返回上个页面
  handleGoBack() {
    wx.navigateBack();
  },

  // 播放暂停
  handlePauseResume() {
    playerStore.dispatch("changeMusicPlayStatusAction", !this.data.isPlaying)
  },

  // 切换上一首音乐
  handlePrevBtnClick() {
    playerStore.dispatch("changeNewMusicAction", false)
  },

  // 切换下一首音乐
  handleNextBtnClick() {
    playerStore.dispatch("changeNewMusicAction", true)
  },

  // 播放模式的切换
  handleModeBtnClick: function () {
    // 计算最新的playModeIndex，取值0、1、2
    let playModeIndex = (this.data.playModeIndex + 1) % 3;

    // 设置playerStore中的playModeIndex
    playerStore.setState("playModeIndex", playModeIndex)
  },
  changePage() {
    this.setData({
      currentPage: this.data.currentPage === 0 ? 1 : 0
    })
  }
})